<template>
<view>
       <uni-popup :class="[!showWechat?'showWechatShare':'']"  ref="popup"  maxHeight="100vh">
      <div class="share_box" v-if="showWechat">
        <img v-if="!$util.isEmpty(qrCodeImg)" class="share_img" :src="qrCodeImg" >
        <image @click="wechatShare" class="share-weixin_btn" :src="`${constant.imgUrl}center/my-league_share_btn.png`" alt="微信分享按钮" mode="widthFix"></image>
      </div>
      <img v-else class="share_tit" :src="`${constant.imgUrl}center/my-league-wechat_share.png`" alt="分享提示">
    </uni-popup>
	</view>
</template>

<script>

import uniPopup from '@/components/uni-popup/uni-popup'

export default {
	components: {
		uniPopup
	},
	props: {
		show: {
			type: Boolean,
			default: true
		},
		qrCodeImg: {
			type: String,
			default: ''
		}
	},
	watch: {
		show(val) {
			this.showWechat = val
		}
	},
	data() {
		return {
			showWechat: true,
			constant: this.$constant
		}
	},
	methods: {
		wechatShare() {
			this.showWechat = false
			this.$emit('update:show', false)
			this.$emit('wechatShare', true)
		}
	}
}
</script>

<style scoped lang="scss">
 .uni-popup {
     background-color: transparent;
  }
    .showWechatShare{
        width: 165px;
        height: 197px;
        overflow: hidden;
        transform: translate(0, 10);
        left: auto;
        top: 18px;
        right: 61px!important;
		background: #7b7b7b;
    }
   .share_box {
     width: 636px;
     height: 916px;
     margin: 0 auto;
    //  left: 50%;
    //  top: 50%;
    //  transform: translate(-50%, -50%);
     background: url($imgUrl+ 'center/my-league_share_bg.png') no-repeat;
     background-size: 100%;
     position: relative;
     & .share_img {
       width: 285px;
       height: 285px;
       position: absolute;
       left: 50%;
       top: 201px;
       transform: translate(-50%,0);
     }
     & .share-weixin_btn {
       width: 489px;
       position: absolute;
       left: 50%;
       bottom: 165px;
       transform: translate(-50%, 0);
     }
  }
    .share_tit {
    width: 100%;
    height: 100%;
  }
</style>
